<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css"
href="../EXT4/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css"
href="../css/style.css" />
<script type="text/javascript" src="../EXT4/ext-all.js"></script>
<script type="text/javascript" src="../script/ext-lang-zh_CN.js"></script>

<script type="text/javascript">

window.onresize = function(){
    setTimeout(function(){panel.setWidth(Ext.getDom("studentlist").width);},100);
};

var pageSize = 10;

Ext.onReady(function() {
	Ext.QuickTips.init();
	Ext.define('Student', { 
        extend: 'Ext.data.Model', 
        fields: ['id','displayName','englishName','school','createTime',
        'grade','age','mother','father','address','phone','emergency',
        'MMobile','MContactType','MContact','MWorking','MPosition'
        ,'FMobile','FContactType','FContact','FWorking',
        'FPosition','relationship','EPhone',{
        	name: 'sex',
        	convert: function(v, record) {
				if(v==1) return "男";
				if(v==0) return "女";
        	}
        },{
        	name: 'birthDate',
        	convert: function(v, record) {
        		var date = new Date(v);
        		return v.substring(0,10);
        	}
        },{
        	name: 'createTime',
        	convert: function(v, record) {
        		var date = new Date(v);
        		return v.substring(0,10);
        	}
        }] 
    });
    
    
    var student_store = Ext.create('Ext.data.Store', {
		model: 'Student', 
		autoLoad: true,
		pageSize: pageSize,
		proxy: { 
	        type: 'ajax', 
	        url: '../service/student_allstu',
	        method: 'POST',
	        reader: { 
	            type: 'json', 
	            root: 'root',
	            total: 'total'
	        }
		}
	});
    
	var header = Ext.create('Ext.form.FieldSet',{
        title: '查询条件',
        collapsible: true,
        defaultType: 'textfield',
        layout: 'hbox',
        items :[{
            fieldLabel: '姓名:',
            id: 'query',
            labelWidth:30,
            width:200,
            margin:'0 10 0 0',
        },{
            fieldLabel: '电话:',
            id: 'query2',
            labelWidth:30,
            width:200,
            margin:'0 10 0 0',
        },{
            fieldLabel: '学校:',
            id: 'query3',
            labelWidth:30,
            width:200,
            margin:'0 10 0 0',
        },{
            fieldLabel: '紧急联系人:',
            id: 'query4',
            labelWidth:70,
            width:200,
            margin:'0 10 0 0',
        }]
    });
    
    
	var content = Ext.create('Ext.grid.Panel',{
		store: student_store,
		tbar: [{
			xtype:'button',
			text:'查询',
			handler: function() {
				var query = Ext.getCmp('query').getValue();
				query = escape(query);
				var query2 = Ext.getCmp('query2').getValue();
				query2 = escape(query2);
				var query3 = Ext.getCmp('query3').getValue();
				query3 = escape(query3);
				var query4 = Ext.getCmp('query4').getValue();
				query4 = escape(query4);
				student_store.loadPage(1,{ params:{
					'query':query,
					'query2':query2,
					'query3':query3,
					'query4':query4
				} });
			}
		}],
		dockedItems: [{ 
	        xtype: 'pagingtoolbar',
	        store: student_store,
	        dock: 'bottom', 
	        displayInfo: true 
         }],
		columns:[{
			text: '姓名',  dataIndex: 'displayName',width:'7%',
		},{
			text: '英文名',  dataIndex: 'englishName',width:'7%'
		},{
			text: '母亲',  dataIndex: 'mother',width:'7%',
			renderer : function(value, meta){
				return '<b>'+value+'</b>';
			},
			listeners:{
				dblclick: function(view, html, raw, col) {
					var student = view.getStore().getAt(raw).data;
				
					var detail = '';
					detail += '电话:'+ student.MMobile +'<br/>';
					detail += '工作:'+ student.MWorking +'<br/>';
					detail += '职位:'+ student.MPosition +'<br/>';
					detail += '联系方式:' +student.MContact;
					
					var tip = Ext.create('Ext.tip.ToolTip', {
						target: html,
						title: student.mother,
						trackMouse: true,
					    html: detail
					});
					
					tip.show();
					
				}
			}
		},{
			text: '父亲',  dataIndex: 'father',width:'7%',
			renderer : function(value, meta){
				return '<b>'+value+'</b>';
			},
			listeners:{
				dblclick: function(view, html, raw, col) {
					var student = view.getStore().getAt(raw).data;
				
					var detail = '';
					detail += '电话:'+ student.FMobile +'<br/>';
					detail += '工作:'+ student.FWorking +'<br/>';
					detail += '职位:'+ student.FPosition +'<br/>';
					detail += '联系方式:' +student.FContact;
					
					var tip = Ext.create('Ext.tip.ToolTip', {
						target: html,
						trackMouse: true,
						title: student.father,
					    html: detail
					});
					
					tip.show();
					
				}
			}
		},{
			text: '学校',  dataIndex: 'school',width:'8%',
		},{
			text: '年级',  dataIndex: 'grade',width:'5%',
		},{
			text: '年龄',  dataIndex: 'age',width:'5%',
		},{
			text: '电话',  dataIndex: 'phone',width:'7%',
		},{
			text: '性别',  dataIndex: 'sex',width:'5%',
		},{
			text: '生日',  dataIndex: 'birthDate',width:'8%',
		},{
			text: '紧急联系人',  dataIndex: 'emergency',width:'8%',
			renderer : function(value, meta){
				return '<b>'+value+'</b>';
			},
			listeners:{
				dblclick: function(view, html, raw, col) {
					var student = view.getStore().getAt(raw).data;
				
					var detail = '';
					detail += '关系:'+ student.relationship +'<br/>';
					detail += '电话:'+ student.EPhone;
					
					
					var tip = Ext.create('Ext.tip.ToolTip', {
						target: html,
						trackMouse: true,
						title:student.emergency,
					    html: detail
					});
					
					tip.show();
					
				}
			}
		},{
			text: '报名时间',  dataIndex: 'createTime',width:'8%',
			
		},{
			xtype: 'actioncolumn',
			text: '修改',
			width:'10%',
			items: [{
				icon   : '../EXT4/fam/cog_edit.png"',
				handler: function(grid, rowIndex, colIndex) {
					var rec = student_store.getAt(rowIndex);
					var edit_win = Ext.create('Ext.Window', {
						width: '95%',
						id: 'edit_win',
						maximized: true,
				    	modal:true,
				    	title: '修改信息',
				    	listeners: {
				    		close: function() {
				    			student_store.load();
				    		}
				    	},
				    	loader: {
				        	url: 'updatestudent?id='+rec.data.id,
				        	loadMask: 'loading...',
				        	autoLoad: true,
				        	scripts: true
				        },
				    });
				    
				    edit_win.show()
				}
			},{
                icon   : '../EXT4/fam/information.png"',  // Use a URL in the icon config
                tooltip: '课耗信息',
                handler: function(grid, rowIndex, colIndex) {
                	var rec = grid.getStore().getAt(rowIndex);
                	Ext.create('Ext.Window', {
                		id:'subjectinfowin',
            	    	width:600,
            	    	height:500,
            	    	resizable :false,
            	    	draggable : false,
            	    	modal:true,
            	    	title:'课耗信息',
            	    	loader: {
            	        	url: 'subjectinfo',
            	        	params : {
            		        	id:rec.data.id
            		        },
            	        	loadMask: '载入中...',
            	        	autoLoad: true,
            	        	scripts: true
            	        },
            	        listeners: {
				    		close: function() {
				    			student_store.load();
				    		}
				    	}
            	    }).show();
                }
            },{
            	 icon   : '../EXT4/fam/plugin.gif"',  // Use a URL in the icon config
                 tooltip: '余额查询',
                 handler: function(grid, rowIndex, colIndex) {
                 	var rec = student_store.getAt(rowIndex);
                 	Ext.create('Ext.Window', {
                 		title: '余额查询',
                 		width:600,
            	    	height:300,
                 		loader: {
            	        	url: 'overage',
            	        	params : {
            		        	studentid:rec.data.id
            		        },
            	        	loadMask: '载入中...',
            	        	autoLoad: true,
            	        	scripts: true
            	        }
                 	}).show();
                 }    	
            }]
		}]
	});
	
	panel=Ext.create('Ext.Panel', {
        id:'main-panel',
        baseCls:'x-plain',
        renderTo:'studentlist',
        items:[header,content]
	});
})
</script>
</head>
<body>
	<div id="studentlist"></div>
</body>
</html>